<!DOCTYPE html>
<html lang="cn">

<head>
	<meta charset="UTF-8">
	<title></title>
	<meta name="keywords" content="">
	<meta name="description" content="">
	<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="renderer" content="webkit">
	<link rel="stylesheet" href="../statics/css/amazeui.min.css">
	<link rel="stylesheet" href="../statics/css/animate.css">
	<link rel="stylesheet" href="../statics/css/layout.css">
	<link rel="stylesheet" href="../statics/iconfont/iconfont.css">
	<link rel="stylesheet" href="../statics/css/pages.css">
	<link rel="stylesheet" href="../statics/css/demo.css" type="text/css" media="screen" />
	<link rel="stylesheet" href="../statics/css//swiper/swiper.min.css" />
	<link rel="stylesheet" href="../statics/css/venobox/venobox.css" type="text/css" media="screen" />
	<script src="../statics/js/jquery-1.11.0.min.js"></script>
	<script src="../statics/js/amazeui.min.js"></script>
	<script src="../statics/js/amazeui.lazyload.min.js"></script>
	<script type="text/javascript" src="../statics/js/venobox/venobox.min.js"></script>
	<style>
		.clearfix:after {
			content: ".";
			display: block;
			height: 0;
			overflow: hidden;
			visibility: hidden;
			clear: both;
			width: 100%
		}
		.client-wrap {
			max-width: 1400px;
			margin: 0 auto;
		}
		.client-wrap .client-content {
			width: 100%;
		}
		@media (min-width:992px) {
			.client-wrap .client-content {
				width: 100%;
				margin: 120px 0;
			} 
			.client-wrap .client-content img{
				float: left;
				width: 23.5%;
				margin-right: 2%;
				height: 180px;
			}
			.client-wrap .client-content img:nth-of-type(4n) {
				margin-right: 0;
			}
		}
		@media (max-width: 991px) {
			.client-wrap .client-content {
				width: 100%;
				margin: 40px 0;
			} 
			.client-wrap .client-content img{
				float: left;
				width: 48%;
				margin-right: 4%;
				height: 120px;
			}
			.client-wrap .client-content img:nth-of-type(2n+1) {
				margin-right: 0;
			}
		}
	</style>
</head>

<body>
	<header class="rb-topbar">
		<div class="amz-container">
			<h1 class="am-topbar-brand rb-brand ">
				<a href="/dsf-web" class="rb-logo">
					<img src="../statics/images/logo.png" alt="/">
				</a>
			</h1>
			<button class="am-topbar-btn am-topbar-toggle am-btn am-btn-sm am-show-sm-only"
				data-am-collapse="{target: '#doc-topbar-collapse-1'}">
				<span class="am-sr-only">
					导航切换
				</span>
				<span class="iconfont icon-bars">
				</span>
			</button>
			<!--#include file="/public/html/menu.html" -->
		</div>
	</header>
	<div class="am-slider-i2">
		<ul class="am-slides">
			<li class="am-slider-images" style="background-image: url(../statics/images/client/banner.jpg)">
				<div class="am-container am-slider-desc">
					<div class="am-slider-content">
						<h3 class="up-en am-slider-title am-animation-slide-left"
							data-am-scrollspy="{animation: 'slide-left', delay: 100}" style="color:#fff;">Cooperative Partner</h3>
						<h3 class="up-cn am-animation-slide-right" data-am-scrollspy="{animation:'slide-right', delay: 500}" style="color:#fff;">合作伙伴
						</h3>
						<i data-am-scrollspy="{animation:'slide-bottom', delay: 700}" class="am-animation-slide-bottom"></i>
						<div data-am-scrollspy="{animation:'slide-left', delay: 1200}" class="rb-bantxt am-animation-slide-right">
							近年来随着人工智能的不断发展，迪赛福创新技术抓住全球“工业4.0”的市场机遇，持续专研创新技术和产品，秉承着严谨苛刻、追求卓越的工作理念打造智能工厂全链条产品，已成功服务超过200多家企业，为10多家上市公司提供专业、可靠的智能工厂解决方案<br />
							我们秉承着创造价值，以服务客户为中心的企业宗旨，高度重视客户的满意程度，客户没有对错，只有满意与不满意，为客户解决核心痛点，成为工厂的手脚、眼睛和大脑串联，并不 断向更广泛的行业领域和应用场景拓展 </div>
					</div>
				</div>
			</li>
		</ul>
	</div>
	<div class="client-wrap">
		<div class="client-content clearfix">
			<img src="../statics/images/home/client01.jpg" alt="">
			<img src="../statics/images/home/client02.jpg" alt="">
			<img src="../statics/images/home/client03.jpg" alt="">
			<img src="../statics/images/home/client01.jpg" alt="">
		</div>
	</div>
	<!-- <div class="swiper-box clearfix">
		<div class="sbox">
			<div class="swiper-container" id="partnerSwiper">
				<div class="swiper-wrapper">
					<div class="swiper-slide">
						<img src="../statics/images/home/client01.jpg" alt="">
					</div>
					<div class="swiper-slide">
						<img src="../statics/images/home/client02.jpg" alt="">
					</div>
					<div class="swiper-slide">
						<img src="../statics/images/home/client03.jpg" alt="">
					</div>
				</div>
			</div>
			<div class="control-box">
				<div class="box clearfix">
					<div class="btn prev_partnerSwiper">
						<img src="../statics/images/prev.gif" alt="">
					</div>
					<div class="btn next_partnerSwiper">
						<img src="../statics/images/next.gif" alt="">
					</div>
				</div>
			</div>
		</div>
	</div> -->

	<style>
		.swiper-box {
			width: 1200px;
			margin: 0 auto;
			padding: 40px 0;
		}
		.swiper-box .box {
			text-align: center;
		}
		.swiper-box .box .btn {
			display: inline-block;
			margin-right: 20px;
		}
		.swiper-box .box .btn:last-child {
			margin-right: 0;
		}
		.swiper-box .box .btn img {
			cursor: pointer;
		}
		.am-slider-i2 .am-slider-content h2 {
			color: #fff;
			width: 100%;
		}

		.am-slider-i2 .am-slider-content .rb-bantxt {
			color: #fff;
		}

		.am-slider-i2 .am-slider-content i {
			background-color: #fff
		}

		.serviceList {
			overflow: hidden;
			width: 100%;
			padding: 100px 10px;
		}

		.serviceList .item {
			padding: 10px;
		}

		.serviceList .item .itemBox {
			background: #000;
		}

		.serviceList .item .itemBox img {
			width: 100%;
			position: relative;
			transition: all 0.3s;
		}

		.serviceList .item .itemBox .texts {
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
			text-align: center;
			width: 85%;
		}

		.serviceList .item .itemBox .texts h2 {
			font-size: 30px;
			color: #fd6100;
			line-height: 2em;
			font-weight: 500;
		}

		.serviceList .item .itemBox .texts h3 {
			font-size: 24px;
			color: #333;
			font-weight: 500;
			font-family: Arial, Helvetica, sans-serif;
			text-transform: uppercase;
		}

		.serviceList .item .itemBox .texts p {
			color: #fff;
			font-size: 14px;
			display: none;
			line-height: 2em;
		}

		.serviceList .item .itemBox .texts i {
			background-color: #000;
			width: 30px;
			height: 2px;
			margin: 20px auto;
			display: none;
		}

		.serviceList .item .itemBox:hover img {
			opacity: 0.5;
		}

		.serviceList .item .itemBox:hover h3 {
			color: #fff;
		}

		.serviceList .item .itemBox:hover p,
		.serviceList .item .itemBox:hover i {
			display: block;
		}

		.rb-footer {
      border-top: 1px solid #f6f5f5;
			background: #fff;
		}

		@media (max-width: 767px) {
			.serviceList {
				padding: 20px 5px;
			}
			.swiper-box {
				width: 100% !important;
			}
			.serviceList .item .itemBox .texts h2 {
				font-size: 24px;
			}

			.serviceList .item .itemBox .texts h3 {
				font-size: 18px;
			}
		}
	</style>


	<!--#include file="/public/html/footer.html"-->
	<script src="../statics/js/canvas.js"></script>
	<script src="../statics/js/swiper/swiper.min.js"></script>
	<script src="../statics/js/wow.min.js"></script>
	<script src="../statics/js/common.js"></script>
	<script>
		var _len = $('#partnerSwiper .swiper-slide')
		var _num 
		if(_len <=3) {
			_num = 1
		}else if(_len <= 6 && _len > 3) {
			_len = 2
		}else {
			len = 3
		}
		var partnerSwipers = creatSwiper("#partnerSwiper", {
      slidesPerView: 4,
      slidesPerColumn: _num,
      spaceBetween: 50,
      breakpoints: {
        1366: {
          spaceBetween: 25
        },
        768: {
          slidesPerView: 2,
          slidesPerGroup: 2,
          slidesPerColumn: 1,
          spaceBetween: 20
        }
      }
    })
	</script>
</body>

</html>